<template>
  <div>
    <div class="summery" style=";margin-top: 0px">
      <div class="title">
        <div>车辆实时信息</div>
        <div>更多>></div>
      </div>
      <div class="conent">
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">在途车辆</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            辆
          </div>

        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">未处理报警异常</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            辆
          </div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">人工报警异常</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            辆
          </div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">系统报警异常</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            辆
          </div>
        </div>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
    <div class="summery">
      <div class="title">
        <div>车辆违章信息</div>
        <div>更多>></div>
      </div>
      <div class="conent info">
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <el-row style="width: 90%;margin-left: 10px">
            <el-col :span="6">AAAAAA</el-col>
            <el-col :span="6">王朝</el-col>
            <el-col :span="6">京广线</el-col>
            <el-col :span="6"style="color: red">超速驾驶</el-col>
          </el-row>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <el-row style="width: 90%;margin-left: 10px">
            <el-col :span="6">AAAAAA</el-col>
            <el-col :span="6">王朝</el-col>
            <el-col :span="6">京广线</el-col>
            <el-col :span="6"style="color: red">超速驾驶</el-col>
          </el-row>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <el-row style="width: 90%;margin-left: 10px">
            <el-col :span="6">AAAAAA</el-col>
            <el-col :span="6">王朝</el-col>
            <el-col :span="6">京广线</el-col>
            <el-col :span="6"style="color: red">超速驾驶</el-col>
          </el-row>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <el-row style="width: 90%;margin-left: 10px">
            <el-col :span="6">AAAAAA</el-col>
            <el-col :span="6">王朝</el-col>
            <el-col :span="6">京广线</el-col>
            <el-col :span="6"style="color: red">超速驾驶</el-col>
          </el-row>
        </div>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
    <div class="summery" style="height: 205px">
      <div class="title">
        <div>仓库资源使用信息</div>
        <div>更多>></div>
      </div>
      <div class="conent">
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">仓库总面积</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
           M&sup2;
          </div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">仓库可用面积</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            M&sup2;
          </div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg">存放危险品</div>
          <div class="num">
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            <div class="num-item">2</div>
            件
          </div>
        </div>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "summery",
    data() {
      return {
        warehousesList: []
      }
    },
    mounted() {
    },
    methods: {

    }
  }
</script>

<style scoped>
  .num-item {
    background: url("../../../static/bg.png") no-repeat center !important;
  }

  .info .msg {
    flex: 1;
  }
</style>
